<template>
  <view class="withdrawalHistory">
    <topTitle title="提现记录" />
    <view class="com">
      <view class="orderList">
        <view v-for="(item, idx) in UserWithdrawalBankCardOrderList" :key="idx">
          <view>
            <view>
              <text v-if="item.state == 0">申請中</text>
              <text v-if="item.state == 1">提現成功</text>
              <text v-if="item.state == 2">提現失敗</text>
            </view>
            <view
              ><text>{{ item.money }}</text></view
            >
          </view>
          <view>{{ formattingTime(item.add_time, 0) }} </view>
          <view>持卡人：{{ item.account_name }} </view>
          <view>卡號：{{ item.card_number }} </view>
          <view>類型：{{ item.bank_name }}</view>
          <view v-if="item.remarks && item.state == 2"
            >備註：{{ item.remarks }}
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script setup lang="ts">
import { ref } from "vue";
import { UserWithdrawalBankCardOrder } from "@/api/UserApi";
import { onReachBottom } from "@dcloudio/uni-app";

let select_time: any = null;
let UserWithdrawalBankCardOrderList = ref<Array<any>>([]);

const UserWithdrawalBankCardOrderFn = async () => {
  let list = await UserWithdrawalBankCardOrder({
    select_time,
  });
  if (!select_time) {
    UserWithdrawalBankCardOrderList.value = list;
  } else {
    UserWithdrawalBankCardOrderList.value = [
      ...UserWithdrawalBankCardOrderList.value,
      ...list,
    ];
  }
};

UserWithdrawalBankCardOrderFn();

onReachBottom(() => {
  select_time =
    UserWithdrawalBankCardOrderList.value[
      UserWithdrawalBankCardOrderList.value.length - 1
    ].add_time;
  UserWithdrawalBankCardOrderFn();
});
</script>
<style scoped lang="scss">
@import "../../static/scss/myWallet.scss";
</style>
